
// Form
// ––––––––––––––––––––––––––––––––––––––––––––––––––

input[type='email'],
input[type='number'],
input[type='password'],
input[type='search'],
input[type='tel'],
input[type='text'],
input[type='url'],
input:not([type]),
textarea,
select
  appearance: none // Removes awkward default styles on some inputs for iOS
  background-color: transparent
  border: .1rem solid $color-grey
  border-radius: .4rem
  box-shadow: none
  box-sizing: inherit // Forced to replace inherit values of the normalize.css
  height: 3.8rem
  padding: .6rem 1.0rem // The .6rem vertically centers text on FF, ignored by Webkit
  width: 100%

  &:focus
    border-color: $color-green
    outline: 0

select
  background: url('data:image/svg+xml;utf8,<svg width="28" height="15" viewBox="0 0 28 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><polygon fill="%235e6772" id="Shape" points="14.3216327 0 7.99510204 5.87878267 1.67836735 0.00773727648 0 1.56757221 7.99510204 9 16 1.55983494"></polygon></svg>') center right no-repeat
  padding-right: 3.0rem

  &:focus
    background-image: url('data:image/svg+xml;utf8,<svg width="28" height="15" viewBox="0 0 28 15" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"><polygon fill="%231abc9c" id="Shape" points="14.3216327 0 7.99510204 5.87878267 1.67836735 0.00773727648 0 1.56757221 7.99510204 9 16 1.55983494"></polygon></svg>')

textarea
  min-height: 6.5rem

label,
legend
  display: block
  font-size: 1.6rem
  font-weight: 700
  margin-bottom: .5rem

fieldset
  border-width: 0
  padding: 0

input[type='checkbox'],
input[type='radio']
  display: inline

.label-inline
  display: inline-block
  font-weight: normal
  margin-left: .5rem
